<template>
	<u-popup :show="show" mode="center" @close="close" :round="30" :closeable="true">
		<view class="points">
			<view class="header">投入积分</view>
			<view class="in_Style">
				<u-input style="width: 450rpx;height: 60rpx;" placeholder="请输入积分" border="none"
					v-model=" model.value"></u-input>
			</view>

			<u-button :custom-style="customStyleBtn1" @click="submit" :loading="loading">
				确定
			</u-button>
		</view>
	</u-popup>
</template>
<script>
	import{investCurrency} from '@/api/index.js'
	export default {
		props: {
			show: {
				type: Boolean,
				default: false
			}
		},
		data() {
			return {
				loading: false,
				model: {
					value: null
				},
				customStyleBtn1: {
					width: '550rpx',
					height: '96rpx',
					borderRadius: '30rpx',
					background: 'linear-gradient(to right, #322D6B, #322D6B)',
					fontSize: '33rpx',
					fontWeight: 800,
					color: '#FFFFFF',
					border: 'none',
					lineHight: '50rpx !important',
					letterSpacing: '1px',
					isEye: false
				},
			}
		},
		methods: {
			async submit() {
				console.log('投入');
				if(!this.model.value){
					uni.showToast({
						title:'请输入积分',
						icon:'none'
					})
					return
				}
				
				if(this.model.value < 0){
					uni.showToast({
						title:'投入积分不能小于0',
						icon:'none'
					})
					return
				}
				await investCurrency({points:this.model.value})
				uni.showToast({
					title:'投入成功',
					icon:'none'
				})
				this.$emit('success')
				this.model.value = null
			},
			close() {
				this.$emit('success')
			}
		}
	}
</script>
<style scoped>
	.header{
		width: 550rpx;
		height: 80rpx;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		color: #333333;
		font-weight: bold;
		font-size: 35rpx;
	}
	.in_Style {
		width: 550rpx;
		height: 85rpx;
		border: 1rpx solid #999999;
		border-radius: 20rpx;
		display: flex;
		align-items: center;
		padding: 0 20rpx;
		box-sizing: border-box;
		margin-bottom: 10rpx;
	}

	.points {
		width: 650rpx;
		min-height: 300rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 10rpx 0rpx 40rpx 0;
		box-sizing: border-box;
		border-radius: 30rpx;
	}
</style>